<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>证书待新增列表</title>
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/plugs/DataTables/css/jquery.dataTables.css">
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/plugs/layui/css/layui.min.css">
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/css/dgg-iboss.min.css">
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/css/dgg-plugs.min.css">
    <link rel="stylesheet" href="../../css/aptitudes.min.css">
</head>
<body>
<div class="titleSearch">
    <div class="layui-inline">
        <label>客户电话：</label>
        <div class="layui-input-inline">
            <input type="text" class="input-style">
        </div>
    </div>
    <div class="layui-inline">
        <label>所属事业部：</label>
        <div class="layui-input-inline">
            <select class="select-style" name="businessOrganizationId">
                <option>全部</option>
                <option value="1">成都资质事业部</option>
                <option value="2">重庆资质事业部</option>
                <option value="3">广州资质事业部</option>
                <option value="4">北京资质事业部</option>
                <option value="5">武汉资质事业部</option>
                <option value="6">深圳资质事业部</option>
                <option value="7">杭州资质事业部</option>
            </select>
        </div>
    </div>
    <div class="layui-inline">
        <label>订单状态：</label>
        <div class="layui-input-inline">
            <select class="select-style" name="lastFollowRecordContent">
                <option>全部</option>
                <option value="1">未支付</option>
                <option value="2">已申请费用</option>
                <option value="3">已支付</option>
            </select>
        </div>
    </div>
    <div class="layui-inline">
        <label>付款类型：</label>
        <div class="layui-input-inline">
            <select class="select-style" name="originType">
                <option>全部</option>
                <option value="1">首款</option>
                <option value="2">全款</option>
            </select>
        </div>
    </div>
    <div class="layui-inline">
        <label>关键字：</label>
        <div class="layui-input-inline">
            <input type="text" class="input-style win250"/>
        </div>
    </div>
    <div class="layui-inline">
        <button class="layui-btn layui-btn-mini layui-btn-normal">搜索</button>
        <button class="layui-btn layui-btn-mini layui-btn-primary">清空</button>
        <button class="layui-btn layui-btn-mini layui-btn-green">导出</button>
    </div>
</div>
<div class="table-conter">
    <a href="javascript:void(0)" class="layui-btn layui-btn-mini" onclick="add()">新增入库</a>
    <a href="javascript:void(0)" class="layui-btn layui-btn-mini" onclick="sendOn()">费用申请</a>
</div>
<table id="myTable" class="cell-border crm-table">
</table>
<!--新增入库弹窗 start-->
<div class="content-layer layui-layer-wrap" id="add">
    <div class="finan-panel">
        <div class="finan-tit">
            <b>证书信息</b>
        </div>
        <div class="panel-table">
            <table class="layui-table table-info">
                <tbody>
                <tr>
                    <th><span class="required">证书类型</span></th>
                    <td>
                        <select class="select-style">
                            <option value="0">全部</option>
                            <option value="1">建造师</option>
                            <option value="2">八大员</option>
                        </select>
                    </td>
                    <th><span class="required">证书专业</span></th>
                    <td>
                        <select class="select-style">
                            <option value="0">全部</option>
                            <option value="1">建造师</option>
                            <option value="2">八大员</option>
                        </select>
                    </td>
                    <th>证书级别</th>
                    <td>
                        <select class="select-style">
                            <option value="0">全部</option>
                            <option value="1">一级</option>
                            <option value="2">二级</option>
                        </select>
                    </td>
                    <th>地区</th>
                    <td>
                        <select class="select-style">
                            <option value="0">全部</option>
                            <option value="1">一级</option>
                            <option value="2">二级</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th><span class="required">证书编号</span></th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>证书过期时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th><span class="required">合同签订时间</span></th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th><span class="required">适用范围</span></th>
                    <td>
                        <select class="select-style">
                            <option value="0">全国</option>
                            <option value="1">本地</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th>三类证书</th>
                    <td>
                        <select class="select-style">
                            <option value="0">A</option>
                            <option value="1">B</option>
                            <option value="2">C</option>
                        </select>
                    </td>
                    <th>三类证书到期时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th><span class="required">回收价格</span></th>
                    <td>
                        <label class="input-unit">
                            <input type="text" class="input-style">
                            <span class="unit">元</span>
                        </label>
                    </td>
                    <th>证书总价</th>
                    <td>
                        <label class="input-unit">
                            <input type="text" class="input-style" placeholder="挂出价格">
                            <span class="unit">元</span>
                        </label>
                    </td>
                </tr>
                <tr>
                    <th>类别</th>
                    <td>
                        <select class="select-style">
                            <option value="0">全部</option>
                            <option value="1">初始</option>
                            <option value="2">转注</option>
                        </select>
                    </td>
                    <th><span class="required">证书名称</span></th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th></th>
                    <td></td>
                    <th></th>
                    <td></td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="finan-panel">
        <div class="finan-tit">
            <b>收证信息</b>
        </div>
        <div class="panel-table">
            <table class="layui-table table-info">
                <tbody>
                <tr>
                    <th>收证商务</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>合同编号</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>是否代签</th>
                    <td>
                        <select class="select-style">
                            <option value="0">是</option>
                            <option value="1">否</option>
                        </select>
                    </td>
                    <th>证书录入时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                </tr>
                <tr>
                    <th><span class="red">*</span>持证人姓名</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th><span class="red">*</span>身份证号码</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th><span class="red">*</span>联系电话</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>微信号码</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                </tr>
                <tr>
                    <th><span class="red">*</span>收款户名</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th><span class="red">*</span>收款账号</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th><span class="red">*</span>开户行</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th><span class="red">*</span>是否有身份证</th>
                    <td>
                        <select class="select-style">
                            <option value="0">是</option>
                            <option value="1">否</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th>定金（元）</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>定金支付时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th>尾款</th>
                    <td>
                        <label class="input-unit">
                            <input type="text" class="input-style">
                            <span class="unit">元</span>
                        </label>
                    </td>
                    <th>尾款支付时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                </tr>
                <tr>
                    <th><span class="red">*</span>是否有资格证书</th>
                    <td>
                        <select class="select-style">
                            <option value="0">是</option>
                            <option value="1">否</option>
                        </select>
                    </td>
                    <th><span class="red">*</span>是否有毕业证书</th>
                    <td>
                        <select class="select-style">
                            <option value="0">是</option>
                            <option value="1">否</option>
                        </select>
                    </td>
                    <th><span class="red">*</span>是否有信息卡</th>
                    <td>
                        <select class="select-style">
                            <option value="0">是</option>
                            <option value="1">否</option>
                        </select>
                    </td>
                    <th><span class="red">*</span>是否集团归档</th>
                    <td>
                        <select class="select-style">
                            <option value="0">是</option>
                            <option value="1">否</option>
                        </select>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="finan-panel">
        <div class="finan-tit">
            <b>证书状态</b>
        </div>
        <div class="panel-table">
            <table class="layui-table table-info">
                <tbody>
                <tr>
                    <th>证书状态</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>在库状态</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>最新出库时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th>最新入库时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                </tr>
                <tr>
                    <th>人才合同到期时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th>企业合同到期时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th>使用公司</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>使用起始时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                </tr>
                <tr>
                    <th>使用到期时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th>三类使用公司</th>
                    <td>
                        <input type="text" class="input-style">
                    </td>
                    <th>三类使用起始时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                    <th>三类使用到期时间</th>
                    <td>
                        <input type="text" class="input-style Wdate">
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="finan-panel">
        <div class="finan-tit">
            <b>附件信息</b>
        </div>
        <div class="panel-main">
            <ul class="data-warp">
                <li title="lADOrfgrlc0DhM0FoA_1440_900.jpg">
                    <div class="data-img">
                        <div class="center">
                            <img class="layui-upload-img">
                        </div>
                        <a href="javascript:void(0)" class="remove-upload"></a>
                    </div>
                    <p>lADOrfgrlc0DhM0FoA_1440_900.jpg</p>
                </li>
                <li title="lADOrfgrlc0DhM0FoA_1440_900.jpg">
                    <div class="data-img">
                        <div class="center">
                            <i class="text-file"></i>
                        </div>
                        <a href="javascript:void(0)" class="remove-upload"></a>
                    </div>
                    <p>lADOrfgrlc0DhM0FoA_1440_900.jpg</p>
                </li>
                <li>
                    <a href="javascript:void(0)" class="upload-button" id="upload"></a><input class="layui-upload-file" type="file" name="file" multiple="">
                    <p>上传附件</p>
                </li>
            </ul>
        </div>
    </div>
</div>
<!--新增入库弹窗 end-->
<!--出库弹窗 start-->
<div  class="content-layer layui-layer-wrap" id="outPut">
    <table class="add-table form-table">
        <tbody>
        <tr>
            <th><span class="required">出库原因：</span></th>
            <td>
                <select name="" class="select-style">
                    <option>全部</option>
                    <option value="1">退回人才</option>
                    <option value="2">人才借用</option>
                    <option value="3">单位借用</option>
                    <option value="4">商务续签</option>
                    <option value="5">后台办理</option>
                </select>
            </td>
        </tr>
        <tr>
            <th><span class="required">出库原因：</span></th>
            <td>
                <label class="checkbox-label"><input type="radio" value="1" name="car"><span>实体件</span></label>
                <label class="checkbox-label"><input type="radio" value="2" name="car"><span>电子件</span></label>
            </td>
        </tr>
        <tr>
            <th><span class="required">领用人：</span></th>
            <td>
                <input type="text" class="input-style">
            </td>
        </tr>
        <tr>
            <th>归还日期：</th>
            <td>
                <input type="text" class="input-style Wdate">
            </td>
        </tr>
        <tr>
            <th>备注：</th>
            <td>
                <textarea class="textarea-style" cols="35" rows="3"></textarea>
            </td>
        </tr>
        </tbody>
    </table>
</div>
<!--出库弹窗 end-->
<script src="https://tstatic.dgg.net/static/plugs/jquery/jquery-1.9.1.min.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/layui/layui.all.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/DataTables/js/jquery.dataTables.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/DataTables/js/dataTables.fixedColumns.min.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/DataTables/js/dataTable.extend.js"></script>
<script src="https://tstatic.dgg.net/static/js/dgg-foot-base.js"></script>
<script>
    //图片上传
    layui.use('upload', function(){
        var $ = layui.jquery
            ,upload = layui.upload;
        upload.render({
            elem: '#upload'
            ,url: '/upload/'
            ,multiple: true
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#upload').parent().before('<li title='+file.name+'><div class="data-img"><div class="center"><img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img"></div><a href="javascript:void(0)" class="remove-upload"></a></div><p>'+file.name+'</p></li>')
                });
            }
            ,done: function(res){
                //上传完毕
            }
        });
    });
    $(function () {
        $('#myTable').dataTableExtend({
            "ajax": "https://www.easy-mock.com/mock/5b601a98e5570610098cc81f/interface/table.co",
//			    	"select":true,
            "scrollX":"true",//是否开启横项滚动
            "fixedColumns":   {//锁定列，只有开启scrollX时才生效
                "leftColumns": 4,//左侧锁定2列
                // "rightColumns": 1//右侧锁定1列
            },
            "fnServerParams": function (aoData) {
                //搜索条件
                aoData.businessOrganizationId = "wait_allot";
                aoData.lastFollowRecordContent = "0";
            },
            "aoColumns": [
                {
                    "sClass": "check-th",
                    "title":"<input type=\"checkbox\" class=\"checkall\" value=\"undefined\">",
                    "orderable": false,
                    "data": "ID",
                    "render": function (data, type, full, meta) {
                        return '<input type="checkbox"  class="checkchild"  value="' + data + '" />';
                    }
                },
                {
                    "title":"序号",
                    "render": function (data, type, full, meta) {
//			                    console.log(meta.row);
                        return meta.row+1;
                    }
                },
                {
                    "title":"所属事业部",
                    "data": "businessOrganizationId",
                    "orderable": false
                },
                {
                    "title":"订单编号",
                    "data": "no",
                    "orderable": false,
                    "render": function (data, type, full, meta) {
                        return '<a href="#" class="iboss-link">'+data+'</a>';
                    }
                },
                {
                    "title":"客户",
                    "data": "createrName",
                    "orderable": false
                },
                {
                    "title":"产品",
                    "data": "lastFollowRecordUser",
                    "orderable": false
                },
                {
                    "title":"合同金额",
                    "data": "originType",
                    "orderable": false
                },
                {
                    "title":"订单状态",
                    "data": "createTime",
                    "orderable": false
                },
                {
                    "title":"付款类型",
                    "data": "lastFollowRecordContent",
                    "orderable": false
                },
                {
                    "title":"付款金额",
                    "data": "lastFollowRecordContent",
                    "orderable": false
                },
                {
                    "title":"付款商务",
                    "data": "lastFollowRecordContent",
                    "orderable": false
                },
                {
                    "title":"签单人部门",
                    "data": "lastFollowRecordContent",
                    "orderable": false
                },
                {
                    "title":"下单时间",
                    "data": "lastFollowRecordContent",
                    "orderable": false
                },
                {
                    "title":"操作",
                    "orderable": false,
                    "render": function (data, type, full, meta) {
                        return '<a href="javascript:void(0)" onclick="outPut()" class="iboss-link">出库</a>' +
                            '<a href="#" class="iboss-link">查看</a>' +
                            '<a href="#" class="iboss-link">编辑</a>';
                    }
                }
            ],
        });
    });
    function add() {
        console.log($('#myTable').dataTableExtend('getCheck'))
        dgg.Open({
            title: '新增入库',
            content: $('#add'),
            area: '80%',
        })
    }
//    出库
    function outPut() {
        dgg.Open({
            title: '出库',
            content: $('#outPut'),
            area: '500px',
        })
    }
</script>
</body>
</html>